<!--@ZixiaFan 2021/11/23 13:20-->
<!DOCTYPE html>
<html lang="en">
<head>
    <title>注册</title>
    <!-- Meta tag Keywords -->
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta charset="UTF-8" />
    <meta name="keywords" content=""
    />
    <script>
        addEventListener("load", function () {
            setTimeout(hideURLbar, 0);
        }, false);

        function hideURLbar() {
            window.scrollTo(0, 1);
        }
    </script>
    <!-- Meta tag Keywords -->
    <!-- css files -->
    <link rel="stylesheet" href="css/style.css" type="text/css" media="all" />
    <!-- Style-CSS -->
    <link rel="stylesheet" href="css/font-awesome.4.7.0.css">
    <!-- Font-Awesome-Icons-CSS -->
    <!-- //css files -->
    <script src="../js/jquery-1.8.0.js"></script>
    <script type="text/javascript">

        //注册提交
        function doRegister() {
            if($('#agreement').is(':checked')==false){
                alert("请同意用户协议才能完成注册！");
                return;
            }else {
            }
            //ajax提交数据
            $.ajax({
                url:"register.do",
                type:"post",
                data:{
                    username:$("#username").val(),
                    password:$("#password").val()
                },
                success:function (data) {
                    if(data==1){
                        alert("注册成功！请尽快设置密保问题，否则忘记密码后无法找回密码");
                        window.location.href="login.html";
                    }else {
                        alert("系统错误，注册失败，强联系客服");
                    }
                }

            });
        }
        //正值
        $(function () {
            $("#username").blur(function () {
                var name=$("#username").val();
                var nameRge=/^[a-zA-Z]{3,10}$/;
                if (!nameRge.test(name)){
                    $("#usernameTips").html("您输入的用户名不符合标准");
                    $("#username").val("");
                    return;
                }
                $.ajax({
                    url: "UniqueUsername.do",
                    type: "post",
                    data: {
                        username:$("#username").val()
                    },
                    success:function (data) {
                       if(data==0){
                           $("#usernameTips").html("用户名已存在");
                           $("#username").val("");
                       }else {
                           $("#usernameTips").html("");
                       }
                    }
                });
            });
            $("#password").blur(function () {
                var pwd=$("#password").val();
                var pwdRge=/^\d{3,10}$/;
                if (!pwdRge.test(pwd)){
                    $("#passwordTips").html("您输入的密码不符合标准");
                    $("#password").val("");
                    return;
                }else {
                    $("#passwordTips").html("");
                }
            });
            $("#rpassword").blur(function () {
                var pwd=$("#password").val();
                var rpwd=$("#rpassword").val();
                if (pwd!=rpwd){
                    $("#rpasswordTips").html("两次密码不一致");
                    $("#rpassword").val("");
                    return;
                }else {
                    $("#rpasswordTips").html("");
                }
            });

        });
    </script>
</head>

<body>
<!-- bg effect -->
<div id="bg">
    <canvas></canvas>
    <canvas></canvas>
    <canvas></canvas>
</div>
<!-- //bg effect -->
<!-- title -->
<h1>Fruit Mall</h1>
<!-- //title -->
<!-- content -->
<div class="sub-main-w3" id="abc">
    <form action="#" method="post">
        <h2>注册
            <i class="fa fa-long-arrow-down"></i>
        </h2>
        <div class="form-style-agile">
            <label>
                <i class="fa fa-user"></i>
                用户名
            </label>
            <input placeholder="用户名" id="username" name="Name" type="text" required="">
            <font id="usernameTips" color="#dc143c"></font>
        </div>
        <div class="form-style-agile">
            <label>
                <i class="fa fa-unlock-alt"></i>
                密码
            </label>
            <input placeholder="密码" id="password" name="Password" type="password" required="">
            <font id="passwordTips" color="#dc143c"></font>
        </div>
        <div class="form-style-agile">
            <label>
                <i class="fa fa-unlock-alt"></i>
                确认密码
            </label>
            <input placeholder="密码" id="rpassword" name="rPassword" type="password" required="">
            <font id="rpasswordTips" color="#dc143c"></font>
        </div>
        <!-- checkbox -->
        <div class="wthree-text">
            <ul>
                <li>
                    <label class="anim">
                        <input type="checkbox" id="agreement"  class="checkbox" required="">
                        <span>同意用户协议</span>
                    </label>
                </li>
                <li>
                    <a href="toLogin">已有账号?前去<font color="aqua">登录</font></a>
                </li>
            </ul>
        </div>
        <!-- //checkbox -->
        <input type="button" value="注册" onclick="doRegister()">
    </form>
</div>
<!-- //content -->

<!-- copyright -->
<div class="footer">

</div>
<!-- //copyright -->

<!-- Jquery -->
<script src="js/jquery-1.10.2.js"></script>
<!-- //Jquery -->

<!-- effect js -->
<script src="js/canva_moving_effect.js"></script>
<!-- //effect js -->

</body>

</html>